<template>
	<view>
		<AdBnner :list="myData.imgs" height="160"></AdBnner>
		<view class="content">
			<view class="A item">
				<view class="left">
					{{name}}
				</view>
				<view class="right">
					<text class="red">单价：{{myData.price}}元</text>
				</view>
			</view>
			<view class="A item">
				<view class="left otherLeft">
					公司名称
				</view>
				<view class="right">
					{{myData.company_name}}
				</view>
			</view>
			<view class="A item">
				<view class="left otherLeft">
					数量
				</view>
				<view class="right">
					{{myData.num}}株
				</view>
			</view>
			<view class="A item">
				<view class="left otherLeft">
					地址
				</view>
				<view class="right">
					{{myData.address}}
				</view>
			</view>
			<view class="C item">
				<view class="left-details">
					产品简介:
				</view>
				<view class="right-details">
					{{myData.introduction}}
				</view>
			</view>
			<view class="C item">
				<view class="left-details">
					查看电话:
				</view>
				<view class="right-details find">
					<text @click="goTel()">{{phone||'****************'}}</text><text class="blue" @click="telPhone"
						style="margin-left: 20px;">查看号码</text>
				</view>
			</view>
		</view>
		<u-toast ref="uToast"></u-toast>
		<bottomShow :showPop = "showBottom" :title="bottomTitle" :tip="bottomTip" @refuse= "refuse" @submit="subTel"></bottomShow>
	</view>
</template>

<script>
	import {
		AdBnner
	} from "@/components/ad-banner/ad-banner.vue"
		import bottomShow from '@/components/common/bottomShow.vue'
	import {
		businessQuoteDetails,
		getPhone
	} from '@/request/api.js'
	export default {
		components: {
			AdBnner,bottomShow
		},
		data() {
			return {
				myType: '',
				list1: [
					'https://cdn.uviewui.com/uview/swiper/swiper1.png'
				],
				busList: {
					page: 1,
					wantbuy_offer_id: ''
				},
				name: '',
				myData: [],
				phone: '',
				form: {
					type: 1,
					id: '',
				},
				showBottom:false,
				showBottom:'',
				bottomTitle:'',
				bottomTip:''
			}
		},
		onLoad(res) {
			this.myType = res.myType
			let title = this.myType == 1 ? '商家报价' : '我的报价'
			this.busList.wantbuy_offer_id = res.data
			this.form.type = this.myType == 1 ? 3 : 3
			this.form.id = res.data
			this.name = res.name
			uni.setNavigationBarTitle({
				title: title
			});
			// console.log(res)
			this.getList()
		},
		methods: {
			goTel() {
				uni.makePhoneCall({
					phoneNumber: this.phone,
					success(res) {
						cconsole.log('拨打电话成功', res);
					},
					fail(err) {
						console.log('拨打电话失败', err);
					}
				})
			},
			getList() {
				businessQuoteDetails(this.busList).then(res => {
					if (res.code == 1) {
						this.myData = res.data
					}
				})
			},
			refuse() {
				this.showBottom = false
			},
			telPhone(){
				if(this.phone == ''){
					this.bottomTitle = '查看电话'
					this.bottomTip = '提示：普通会员查看电话需要充值积分，黄金会员或者钻石会员查看电话免费，自己查看自己电话免费！'
					this.showBottom = true
				}else{
					
				}
				
			},
			subTel(){
				getPhone(this.form).then(res=>{
					if(res.code == 1){
						this.phone = res.data.phone
						this.$refs.uToast.show({
							type: 'success',
							title: '获取电话成功',
							message: "获取电话成功",
						})
					}
				})
				this.showBottom = false
			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		display: flex;
		flex-direction: column;
		padding: 20rpx 15rpx;
		color: #4F4F4F;
		.red{
			color: #FD4343;
		}
		.item {
			padding: 15px 0;
			border-bottom: 1px solid #E2E2E2;
		}

		.A {
			display: flex;
			align-items: center;

			.left {
				color: #00C777;
				flex: 1;
			}

			.otherLeft {
				color: #4F4F4F;
			}

			.right {}
		}

		.B {
			display: flex;
			flex-direction: column;

			.first {
				display: flex;
				margin-bottom: 20rpx;

				.b_item {
					margin-right: 40rpx;
				}
			}

			.second {
				display: flex;

				.b_item {
					margin-right: 130rpx;
				}
			}
		}

		.C {
			display: flex;

			.left-details {
				width: 80px;
			}

			.right-details {
				flex: 1;

			}

			.find {
				text-align: right;
				margin-right: 20rpx;
			}
		}

		.D {}

		.blue {
			color: #00C777;
		}

	}
</style>
